import "../assets/css/app/index.css"
import "../assets/css/ui/index.css"

import BaseComponent from "../app/baseComponent";

import "../app/base/app";

import { AUI } from "andy-ui";

import deepmerge from "deepmerge";

window.AUIDeepmerge = deepmerge;

window.AUI = AUI;

window.AUI.app = {};

window.AUI.app.BaseComponent = BaseComponent;

const GridExample =  () => ({
    component: import('./grid/index')
});

const MediaExample = () => ({
    component: import('./media/index')
});

const MobileExample = () => ({
    component: import('./mobile/index')
});

const PopoverExample = () => ({
    component: import('./popover/index')
});

const DateExample = () => ({
    component: import('./date/index')
});

const ButtonExample = () => ({
    component: import('./button/index')
});

const FormExample = () => ({
    component: import('./form/index')
});

const PaginationExample = () => ({
    component: import('./pagination/index')
});

const ModalExample = () => ({
    component: import('./modal/index')
});

const LoadingExample = () => ({
    component: import('./loading/index')
});

const ScrollExample = () => ({
    component: import('./scroll/index')
});

const CardExample =  () => ({
    component: import('./card/index')
});

const TabExample = () => ({
    component: import('./tab/index')
});

const ColorpickerExample = () => ({
    component: import('./colorpicker/index')
});

const ProgressExample =  () => ({
    component: import('./progress/index')
});

const UtilitiesExample = () => ({
    component: import('./utilities/index')
});

let routes = [
    { path: '/', redirect: '/grid' },   
    {
        path: "/grid",
        component: GridExample
    },
    // {
    //     path: "/media",    
    //     component: MediaExample
    // },
    // {
    //     path: "/mobile",    
    //     component: MobileExample
    // },    
    // {
    //     path: "/popover",
    //     component: PopoverExample
    // },    
    {
        path: "/date",
        component: DateExample
    },
    {
        path: "/button",
        component: ButtonExample
    },
    {
        path: "/form",
        component: FormExample
    },   
    // {
    //     path: "/pagination",
    //     component: PaginationExample
    // },       
    // {    
    //     path: "/modal",
    //     component: ModalExample    
    // },   
    // {    
    //     path: "/loading",
    //     component: LoadingExample    
    // },      
    // {
    //     path: "/scroll",
    //     component: ScrollExample    
    // },
    // {
    //     path: "/card",
    //     component: CardExample    
    // },
    // {
    //     path: "/tab",
    //     component: TabExample    
    // },
    // {
    //     path: "/progress",
    //     component: ProgressExample
    // },
    // {
    //     path: "/colorpicker",
    //     component: ColorpickerExample    
    // },           
    // {
    //     path: "/utilities",    
    //     component: UtilitiesExample
    // },
];

const router = new VueRouter({
    routes: routes
});

new Vue({
    el: "#app",
    data: {
        routes: routes
    },
    router
});


